<!DOCTYPE html>
<html>
<head>
  <script src="jquery-1.4.4.min.js"></script>
  <script src="jquery.tmpl.min.js"></script>
  <script>
  $(document).ready(function(){
      	$('#clickme').click(function(){
          	var moviesServiceUrl="http://odata.netflix.com/Catalog/Genres('Cartoons')/Titles?$format=json&$skip=0&$top=10";
          	$.ajax({
        	    dataType: "jsonp",
        	    url: moviesServiceUrl,
        	    jsonp: "$callback",
        	    success: function(data){
        	    	var movies = data.d;
        			var extProperties = {
       					 age: function(){
       						  var yearReleased = this.data.ReleaseYear;
       						  var yearCurrent = (new Date()).getFullYear();
       						  return yearCurrent-yearReleased + ' years old';
       					 },
       					 actors: ['I','You','She']
       				};
                    $( "#movieList" ).empty();
                    $( "#movieTemplate").tmpl(movies,extProperties).appendTo( "#movieList" );	   	    	
        	    }
        	});      		
      	});      	
  });  
  </script>
  
</head>
<body>

<input id="clickme" type="button" value="clickme" >

<script id="movieTemplate" type="text/x-jquery-tmpl"> 
    <li><b>${Name}</b> ${ReleaseYear} -> ${$item.actors[1]} -> ${$item.age()} </li>
</script>

<ul id="movieList"></ul>

<script>

</script>
</body>
</html>